<!--
- Author:  LiShibin.
- Date:    2018/9/5.
- File:    balanceLog.
-->
<template>
  <div>
    <div class="Web_Box">
      <!--<div class="gd lt0 wauto z99">-->
      <!--<div class="Tabs2">-->
      <!--<ul>-->
      <!--<li :class="{'on': orderType == '1'}" style="width: 50%" @click="switchOrderType('1')">普通商品</li>-->
      <!--<li :class="{'on': orderType == '4'}" style="width: 50%" @click="switchOrderType('4')">积分商品</li>-->
      <!--</ul>-->
      <!--</div>-->
      <!--</div>-->
      <!--<div class="gd lt0 wauto z99">-->
        <!--<div class="Tabs2">-->
          <!--<ul>-->
            <!--<li :class="{'on': type == 1}" style="width: 50%" @click="switchType(1)">返佣</li>-->
            <!--<li :class="{'on': type == 2}" style="width: 50%" @click="switchType(2)">分红</li>-->
          <!--</ul>-->
        <!--</div>-->
      <!--</div>-->
      <div class="integrat2 f-cb">
        <span style="font-size: 10px;float: left;width: 33.3%;">已提现金额:{{memberInfo.f_bankamount}}</span>
        <span style="font-size: 10px;float: left;width: 33.3%;">提现中金额:{{memberInfo.withdrawing}}</span>
        <span style="font-size: 10px;float: left;width: 33.3%;">实际金额:{{memberInfo.real_withdraw_amount}}</span>
        <!--<span style="font-size: 12px;float: left;width: 33.3%;text-align: center">冻结花股:{{memberInfo.freeze_hg}}</span>-->
        <!--<span style="font-size: 12px;float: left;width: 33.3%;text-align: center">冻结花粉:{{memberInfo.freeze_hf}}</span>-->
        <!--<router-link :to="{name: 'member-spread'}" class="more">推荐用户购买</router-link>-->
      </div>
      <div class="DistributionOrder">
        <div class="ProList pt10">
          <ul
            v-infinite-scroll="loadLog"
            infinite-scroll-disabled="false"
            infinite-scroll-distance="0"
            infinite-scroll-immediate-check="false">
            <li v-for="item in orderList.data">
              <div class="inter_tab"><a>
                <table width="100%" border="0">
                  <tr>
                    <td colspan="2" width="100%">提现金额：{{item.withdrawals_amount}}元</td>
                    <!--<td width="50%">状态：{{history.state | integralStatusTxt}}</td>-->
                  </tr>
                  <tr>
                    <td colspan="2" width="100%">实际到账金额：{{item.amount}}元<span class="cr_f83166"></span></td>
                    <!--<td v-show="history.type == $dictionary.userLv.a && type == '2'">合计：<span class="cr_f83166">￥{{parseFloat(history.order_amount) + parseFloat(history.freeze_balance)}} </span>-->
                    <!--</td>-->
                  </tr>
                  <tr>
                    <td colspan="2" width="100%" v-show="item.type == 2">类型：转到银行卡</td>
                    <!--<td width="50%">状态：{{history.state | integralStatusTxt}}</td>-->
                  </tr>
                  <!--<tr>-->
                  <!--<td width="50%" v-show="type == '2'">本金：<span>￥{{history.order_amount}}</span></td>-->
                  <!--<td>购买人：{{history.member_truename}}</td>-->
                  <!--</tr>-->
                  <tr>
                    <td colspan="2" width="100%">提现时间：{{item.add_time | timestampToDate('yyyy-MM-dd hh:mm')}}</td>
                    <!--{{item.add_time | timestampToDate('yyyy-MM-dd hh:mm')}}-->
                    <!--<td>到账时间：{{history.fbaddtime | timestampToDate('yyyy-MM-dd')}}</td>-->
                  </tr>
                  <tr>
                    <td colspan="2" width="100%">手续费：{{item.handing_fee}}元</td>
                    <!--{{item.add_time | timestampToDate('yyyy-MM-dd hh:mm')}}-->
                    <!--<td>到账时间：{{history.fbaddtime | timestampToDate('yyyy-MM-dd')}}</td>-->
                  </tr>
                  <tr>
                    <td colspan="2" width="100%" style="color: #898989;" v-show="item.state==0">状态：待审核</td>
                    <td colspan="2" width="100%" style="color: #898989;" v-show="item.state==1">状态：已审核通过</td>
                    <td colspan="2" width="100%" style="color: #898989;" v-show="item.state==2">状态：已审核拒绝</td>
                    <td colspan="2" width="100%" style="color: #898989;" v-show="item.state==3">状态：撤销</td>
                  </tr>
                </table>
              </a></div>
            </li>
          </ul>
          <loading-more :allLoaded="orderList.allLoaded" :show="orderList.data.length > 0"></loading-more>
        </div>
      </div>
    </div>
    <empty-data :show="orderList.allLoaded && orderList.data.length <= 0" style="margin-top: 1rem"></empty-data>
    <footer-tab></footer-tab>
  </div>
</template>

<script>
  import {mapModules, mapRules} from 'vuet'

  export default {
    mixins: [
      mapModules({memberInfo: 'memberInfo'}),
      mapRules({need: ['memberInfo']})
    ],
    data() {
      return {
        type: 1,
        orderList: {requested: false, loading: false, allLoaded: false, page: 1, pageSize: 5, data: []}
      }
    },
    created() {
      this.getLogList(this.orderList.page, this.orderList.pageSize, this.type)
    },
    components: {},
    methods: {
      switchType(type) {
        this.type = type
        this.orderList = {requested: false, loading: false, allLoaded: false, page: 1, pageSize: 5, data: []}
        this.getLogList(this.orderList.page, this.orderList.pageSize, this.type)
      },
      loadLog() {
        if (this.orderList.loading || this.orderList.allLoaded) { // 正在加载 或 已取得全部数据
          return
        }
        setTimeout(() => {
          this.getLogList(++this.orderList.page, this.orderList.pageSize, this.type)
        }, 500)
      },
      getLogList(page, pageSize) {
        this.orderList.loading = true
        this.$request.withdrawLog(this.memberInfo.member_id, page, pageSize).then(data => {
          if (data.length < this.orderList.pageSize) {
            this.orderList.allLoaded = true
          }
          this.orderList.data = [...this.orderList.data, ...data]
        }).finally(() => {
          this.orderList.requested = true
          this.orderList.loading = false
        })
      }
    }
  }
</script>

<style>

</style>
